<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta charset="utf-8">
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta http-equiv="Cache-Control" content="no-siteapp">
		<meta content="yes" name="apple-mobile-web-app-capable">
		<meta content="yes" name="apple-touch-fullscreen">
		<meta content="telephone=no" name="format-detection">
		<meta content="black" name="apple-mobile-web-app-status-bar-style">
		<meta name="copyright" content="Copyright &copy;UnitedBitcoin">
		<meta name="revisit-after" content="1 days">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<title>WSEC 亚洲超级电网</title>
		<link rel="shortcut icon" href="img\icon.png">
		<link rel="stylesheet" href="css\style.css?__hbt=1516279253583">
		<script type="text/javascript" src="js\jquery-1.8.3.min.js"></script>
		<script type="text/javascript" src="js\iscroll.min.js"></script>
		<style type="text/css">
			
			.english{
				display: none;	
			}
			.china{
				
				word-wrap: break-word;
				word-break: normal;
			}
			.japanese{
				display: none;
			}
			.korean{
				display: none;
			}
			.iScrollHorizontalScrollbar.iScrollLoneScrollbar{
				background: #25252a;
				border-radius: 3px;
			}
			.iScrollIndicator{
				background: #dadada !important;
            }
            .nav li span a{
                color: #fff;
            }
            .login{
                width: 40%;
                margin: 0 auto;
            }
            .login .login1{
                text-align: center;
                margin-bottom: 50px;
                cursor: pointer;
            }
            .login .login1 span{
                font-size: 26px;
                color: #fff;
                text-align: center;
                margin-right: 50px;
            }
            .login .login1 .active{
                color: #0b39ef;
            }
            .login input{
                outline: none;
                width: 476px;
                height: 40px;
                padding-left: 20px;
                margin-left: 100px;
                margin-bottom: 1px;
            }
            .login .login2{
                width: 500px;
                text-align: right;
                margin-left: 100px;
                color: #fff;
                font-size: 14px;
                margin-top: 20px;
                margin-bottom: 60px;
                cursor: pointer;
            }
            .login button{
                width: 500px;
                height: 38px;
                margin-left: 100px;
                background: transparent;
                border: 1px solid #0b39ef;
                color: #fff;
                cursor: pointer;
            }

            .register{
                width: 40%;
                margin: 0 auto;
                display: none;
            }
            .register .login1{
                text-align: center;
                margin-bottom: 50px;
                cursor: pointer;
            }
            .register .login1 span{
                font-size: 26px;
                color: #fff;
                text-align: center;
                margin-right: 50px;
            }
            .register .login1 .active{
                color: #0b39ef;
            }
            .register input{
                outline: none;
                width: 476px;
                height: 40px;
                padding-left: 20px;
                margin-left: 100px;
                margin-bottom: 1px;
            }
            .register button{
                width: 500px;
                height: 38px;
                margin-left: 100px;
                background: transparent;
                border: 1px solid #0b39ef;
                color: #fff;
                margin-top: 56px;
                cursor: pointer;
            }
            .register .clause{
                width: 500px;
                height: 50px;
                line-height: 50px;
                text-align: center;
                margin-left: 100px;
            }
            .register .clause span:nth-child(1){
                display: inline-block;
                width: 13px;
                height: 13px;
                background-color: #fff;
                vertical-align: middle;
                position: relative;
            }
            .register .clause span:nth-child(1) i{
                position: absolute;
                top: -18px;
                left: 0;
                color: #333;
            }
            .register .clause span:nth-child(2){
                color: #fff;
                margin: 0 10px;
            }
            .register .clause a{
                color: #0b39ef;
            }
            .register label{
                position: relative;
            }
            .register label span{
                position: absolute;
                right: 10px;
                top: 0;
                color: #0b39ef;
                font-size: 14px;
            }
		</style>
	</head>

	<body>
		<div class="headerBg" id="header"></div>
		<header>
			<div class="headerBox">
				<img class="logo" src="img\LOGO.gif" alt="BITCOIN SHINE">
				<ul class="language">
					<li>
						<a>EN</a>
						|
						<a class="active">中文</a>
					</li>
				</ul>
				<ul id="nav" class="nav">
					<li><span class="china"><a href="./index.html">首页</a></span><span class="english"><a href="./index.html">Home</a></span><span class="japanese">日语</span><span class="korean">韩语</span></li>			
				</ul>
				
			</div>
			
		</header>
		<div style="background:#121619;width:1920px;height:974px;padding-top:140px">
            <div class='login'>
                <p class='china login1'><span class='active'>登录</span><span id='register'>注册</span></p>
                <p class='english login1'><span>Login</span><span>Register</span></p>
                <input class='china' type="text" placeholder="手机号/邮箱">
                <input class='english' type="text" placeholder="Phone/Email">
                <input class='china' type="password" placeholder="登录密码">
                <input class='english' type="password" placeholder="Login Password">
                <p class='china login2'>忘记密码？</p>
                <p class='english login2'>forget the password?</p>
                <button class='china'>登录</button>
                <button class='english'>Login</button>
            </div>
            <div class='register'>
                    <p class='china login1'><span id='login'>登录</span><span class='active'>注册</span></p>
                    <p class='english login1'><span>Login</span><span>Register</span></p>
                    <input class='china' type="text" placeholder="手机号/邮箱">
                    <input class='english' type="text" placeholder="Phone/Email">
                    <label class='china'><input type="text" placeholder="短信/邮箱验证码"><span>获取</span></label>
                    <label class='english'><input type="text" placeholder="Phone/Email Code"><span>send</span></label>
                    <input class='china' type="password" placeholder="登录密码">
                    <input class='english' type="password" placeholder="Login Password">
                    <input class='china' type="password" placeholder="确认登录密码">
                    <input class='english' type="password" placeholder="Confirm login password">
                    <button class='china'>注册</button>
                    <button class='english'>Register</button>
                    <p class='china clause'><span><i>√</i></span><span>我已阅读并同意WSEC</span><a href="javascript:;">服务条款</a></p>
                    <p class='english clause'><span><i>√</i></span><span>I have read and agreed with WSEC.</span><a href="javascript:;">terms of service</a></p>
                </div>
        </div>
		<script>
			var windowHeight = $(document.body).outerHeight(true)/3;
				var addNum = 100/200;
				
			    var Opacity;
			$(window).scroll(function(){
		    		
				    if($(window).scrollTop()<110){
				      	$('#header').css({"filter":"alpha(Opacity=0)","-moz-opacity":"0","opacity":"0"}); 				      
				    }else{
				    	Opacity = parseInt($(window).scrollTop()*addNum); 
				    	if(Opacity>=80){
				    		$('#header').css({"filter":"alpha(Opacity=80%)","-moz-opacity":'0.8',"opacity":'0.8'}); 
				    	}else{
				    		$('#header').css({"filter":"alpha(Opacity="+Opacity+"%)","-moz-opacity":Opacity/100,"opacity":Opacity/100}); 
				    	}
				    	
				    }
				});
			$(function(){
				
				
				
				$('#nav li').on('click',function(){
			   		var index = $(this).index();
					if(index<5){
			   			$('html, body').animate({  
				            scrollTop: $('.sider').eq(index).offset().top-90  
				        }, 1000); 
			   		}
			   		 
			    });
			    $('.language a').on('click',function(){
			    	$('.language a').removeClass('active');
			   		var indexNum = $(this).index();
			   		$('.language a').eq(indexNum).addClass('active');
			   		
					if (indexNum==1) {
						$('.japanese').hide();
						$('.korean').hide();
						$('.english').hide();
						$('.china').show();
						$('title').html('WSEC 亚洲超级电网')
					} else if (indexNum==0) {
						$('.japanese').hide();
						$('.korean').hide();
						$('.china').hide();
						$('.english').show();
						$('title').html('WSEC Asian supergrid')
					} 
			    });
			    
			    $('.submenu li').on('click',function(){
			    	$('.menu>li>a').html($(this).text());
			    	 $(this).hide().siblings().show();
			   		var index = $(this).index();
					if (index==0) {
						$('.japanese').hide();
						$('.korean').hide();
						$('.english').hide();
						$('.china').show();
					} else if (index==1) {
						$('.japanese').hide();
						$('.korean').hide();
						$('.china').hide();
						$('.english').show();
					} else if (index==2) {
						
						$('.korean').hide();
						$('.china').hide();
						$('.english').hide();
						$('.japanese').show();
					} else if (index==3) {
						$('.japanese').hide();
						$('.english').hide();
						$('.china').hide();
						$('.korean').show();
					}
			   		 
			   });
				
				$('.logo').on('click',function(){
			   		var index = $(this).index();
			   		if(index==0){
			   			$('html, body').animate({  
				            scrollTop: 0  
				        }, 1000); 
			   		}
			   		
				
			   	})
				var myscroll= new IScroll('#wrapper',{
                        mouseWheel: true,
                        scrollbars: true,
                        //scrollbars: "custom",
                        //fadeScrollbars : true,
                        bounceEasing : 'quadratic',
                        scrollX: true,
                        scrollY: false
                    });
			})
            $('#register').on('click',function(){
                $('.login').hide();
                $('.register').show();
            })
            $('#login').on('click',function(){
                $('.register').hide();
                $('.login').show();
            })
		</script>
	</body>

</html>